@use '../../token/colors';

$jhlite-header-color-background: colors.$jhlite-global-color-fill-secondary;

.jhlite-header {
  display: flex;
  align-items: center;
  background-color: $jhlite-header-color-background;
  padding: 0.5rem 1rem;

  &--slot {
    &.-expand {
      flex-grow: 1;
    }
  }

  .jhlite-with-theme-switch {
    display: flex;
    gap: 16px;
    align-items: center;
  }
}
